<template>
  <div>
    <c-table-box ref="cTableBox" hide-func checkbox :other-filters="otherFilters" :table-config="tableConfig" @selection-change="selectionChange">
      <template #btn>
        <template v-if="type==='waitAudit'" code="audit">
          <AuditDraw :sel-data="selections" opt-code="audit" @on-success="refreshTableData" />
        </template>
      </template>
    </c-table-box>
  </div>
</template>
<script>
import { otherFiltersItem } from '@/utils'
import AuditDraw from './AuditDraw'
export default {
  name: 'List',
  components: {
    AuditDraw
  },
  props: {
    type: {
      type: String,
      default: ''
    },
    activeType: {
      type: String,
      default: ''
    },
    serachFilters: {
      type: Array,
      default: () => []
    }
  },
  data() {
    return {
      tableConfig: {
        interfacePath: '/slm-admin/api/v1/designPictureMaintain/pictureResultMaintainAdmin',
        hideFuncBar: true,
        sort: 'createTime',
        sortersRow: [
          // { 'id': 'constCode', 'property': 'constCode', 'direction': 'DESC' }
        ],
        apiHeader: {
          'Permission-App': 'slm'
        },
        setting: [
          {
            prop: 'picTaskCode',
            label: '图纸编码',
            minWidth: 180,
            className: 'btn-green',
            isButton: true,
            clickFun: this.toDetail
          },
          {
            prop: 'url',
            label: '图纸预览',
            width: 120,
            render: (h, row) => {
              return h('c-accessory', {
                props: {
                  src: row.url,
                  type: row.typeName,
                  width: '100px',
                  height: '60px'
                }
              })
            }
          },
          {
            prop: 'picBatchCode',
            label: '图纸批号',
            minWidth: 180
          },
          {
            prop: 'constCode',
            label: '门店建设项目号',
            width: 180
          },
          {
            prop: 'constState',
            label: '门店建设状态',
            minWidth: 140,
            propEnum: {
              domainCode: 'marketing',
              appCode: 'slm',
              dictTypeCode: 'CONST_STATE'
            }
          },
          {
            prop: 'picTaskName',
            label: '图纸名称',
            width: 120
          },
          {
            prop: 'picType',
            label: '图纸类型',
            width: 120,
            propEnum: {
              domainCode: 'marketing',
              appCode: 'slm',
              dictTypeCode: 'PIC_TYPE'
            }
          },
          {
            prop: 'designRange',
            label: '设计范围',
            width: 120,
            render: (h, row) => {
              return h('c-dict-range-view', {
                props: {
                  dictTypeCode: 'DECORATION_RANGE',
                  value: row.designRange
                }
              })
            }
          },
          {
            prop: 'decorationType',
            label: '装修形式',
            width: 120,
            render: (h, row) => {
              return h('c-dict-range-view', {
                props: {
                  dictTypeCode: 'DECORATION_FORM',
                  value: row.decorationType
                }
              })
            }
          },
          {
            prop: 'designSpace',
            label: '设计区域',
            width: 120,
            render: (h, row) => {
              return h('c-design-area', { props: { value: row.designSpace }})
            }
          },
          {
            prop: 'designBizType',
            label: '设计业务类型',
            width: 120,
            render: (h, row) => {
              return h('c-dict-range-view', {
                props: {
                  dictTypeCode: 'BIZ_TYPE',
                  value: row.designBizType
                }
              })
            }
          },
          {
            prop: 'isRedesign',
            label: '是否重复设计',
            width: 120,
            propEnum: {
              domainCode: 'marketing',
              appCode: 'slm',
              dictTypeCode: 'BOOLEANS'
            }
          },
          {
            prop: 'designUnitName',
            label: '设计单位',
            width: 120
          },
          {
            prop: 'designerName',
            label: '设计师',
            width: 120
          },
          {
            prop: 'shopName',
            label: '所属门店',
            width: 120
          },
          {
            prop: 'officeName',
            label: '所属办事处',
            width: 120
          },
          {
            prop: 'clientName',
            label: '所属客户',
            width: 120
          },
          {
            prop: 'customerConfirmResult',
            label: '经销商确认结果',
            width: 140,
            propEnum: {
              domainCode: 'marketing',
              appCode: 'slm',
              dictTypeCode: 'BOOLEANS'
            }
          },
          {
            prop: 'customerFeedbackAdvice',
            label: '经销商反馈意见',
            width: 140
          },
          {
            prop: 'managerReviewResult',
            label: '确认结果审核',
            width: 120,
            formatData: row => {
              const v = row.managerReviewResult
              if (v === 1 || v === '1') {
                return '同意商家确认结果'
              } else if (v === 0 || v === '0') {
                return '不同意商家确认结果'
              }
              return ''
            }
            // propEnum: {
            //   domainCode: 'marketing',
            //   appCode: 'slm',
            //   dictTypeCode: 'BOOLEANS'
            // }
          },
          {
            prop: 'managerReviewAdvice',
            label: '审核意见',
            width: 120
          },
          {
            prop: 'schedule',
            label: '图纸进度',
            width: 120,
            propEnum: {
              domainCode: 'marketing',
              appCode: 'slm',
              dictTypeCode: 'PIC_DESIGN_SCHEDULE'
            }
          }
        ]
      },
      typeFilters: [],
      selections: []
    }
  },
  computed: {
    otherFilters() {
      return [...this.serachFilters, ...this.typeFilters]
    }
  },
  watch: {
    type: {
      handler(v) {
        this.setOtherFilters(v)
      },
      immediate: true
    },
    serachFilters: {
      handler(v) {
        if (this.activeType !== this.type) return
        this.$nextTick(() => {
          this.$refs.cTableBox.initTableData()
        })
      }
    }
  },
  created() {
  },
  activated() {
    if (this.ready && this.refreshTableData) {
      this.refreshTableData()
    }
  },
  deactivated() {
    this.ready = true
  },
  methods: {
    // 设置过滤条件
    setOtherFilters(v) {
      switch (v) {
        case 'all':
          this.typeFilters = [
            otherFiltersItem('schedule', '[A,G]', 'not in'),
            otherFiltersItem('picType', 'SG', '<>'),
            otherFiltersItem('isValid', 1, '=')
          ]
          break
        case 'waitAudit':
          this.typeFilters = [
            otherFiltersItem('schedule', 'E', '='),
            otherFiltersItem('constState', 'A', '='),
            otherFiltersItem('isValid', 1, '=')
          ]
          break
      }
    },
    selectionChange(v) {
      this.selections = v
    },
    refreshTableData(v = 'onPage') {
      this.$nextTick(() => {
        this.$refs.cTableBox.initTableData(v)
      })
    },
    // 详情
    toDetail(row) {
      this.$router.push({ name: 'ShopDrawingDetail', query: { id: row.designPictureHandelId, picTaskCode: row.picTaskCode }})
    }
  }
}
</script>
<style lang="scss" scoped>
.image{
  width: 48px;
  height: 48px;
}
</style>
